{# Heredando la plantilla principal #}

{% extends 'default.html' %}
{% use 'navegacion.html' %}
{% use 'loginUsuario.html' %}

{% block contenidos %}
<section style="margin-top:50px">
	<div class="hero-unit">
	  <h1>Empleados</h1>
	 </div>
	 <div class="hero-unit">
			<legend style="color:#339900">Activos ({{ empleadosActivos|length }})</legend>
			{% if empleadosActivos|length > 0 %}
			<table id="activos" class="tablesorter">
			  <thead>
				<tr>
				  <th>CUIL</th>
				  <th>Apellido y Nombre</th>
				  <th>Documento</th>
				  <th>Acciones</th>
				</tr>
			  </thead>
			   <tbody>					
				{% for empleado in empleadosActivos %}
					<tr>
					  <td>{{ empleado.nrcuil }}</td>
					  <td>{{ empleado.apeynombre }}</td>
					  <td>{{ empleado.tipoydoc }}</td>
					  <td><a href="perfilEmpleado.php?cuil={{ empleado.nrcuil }}"><i title="Perfil" class="icon-user icon-black"></i></a> <a href="modificarPerfilEmpleado.php?cuil={{ empleado.nrcuil }}"><i title="Editar" class="icon-pencil icon-black"></i></a> <a href="confimareliminarEmpleado.php?cuil={{ empleado.nrcuil }}"><i title="Eliminar" class="icon-trash"></i></a> </td>
					</tr>
				{% endfor %}
			   </tbody>	
	  		</table>
			{% endif %}
			<legend style="color:#FF0000">Inactivos ({{ empleadosBaja|length }})</legend>
			{% if empleadosBaja|length > 0 %}
			<table id="inactivos" class="tablesorter">
			  <thead>
				<tr>
				  <th>CUIL</th>
				  <th>Apellido y Nombre</th>
				  <th>Documento</th>
				  <th>Acciones</th>
				</tr>
			  </thead>
			   <tbody>	
				{% for empleado in empleadosBaja %}
					<tr>
					  <td>{{ empleado.nrcuil }}</td>
					  <td>{{ empleado.apeynombre }}</td>
					  <td>{{ empleado.tipoydoc }}</td>
					  <td><a href="perfilEmpleado.php?cuil={{ empleado.nrcuil }}"><i class="icon-user icon-black"></i></a> <a href="modificarPerfilEmpleado.php?cuil={{ empleado.nrcuil }}"><i class="icon-pencil icon-black"></i></a> <a href="confimareliminarEmpleado.php?cuil={{ empleado.nrcuil }}"><i title="Eliminar" class="icon-trash"></i></a></td>
					</tr>
				{% endfor %}
			   </tbody>	
	  		</table>
			{% endif %}
	  <p><button id="nuevoEmpleado" name="nuevoEmpleado" class="btn btn-primary" onclick="location.href='nuevoEmpleado.php'">Agregar Empleado</button></p>
	</div>
</section>
{% endblock %}
{% block cssPropios %}
	<link rel="stylesheet" href="css/tablesorter/themes/blue/style.css" type="text/css" id="" media="print, projection, screen" />
{% endblock %}
{% block javaScripts %}
	<script type="text/javascript" src="lib/js/jquery-tablesorter/jquery.metadata.js"></script>
	<script type="text/javascript" src="lib/js/jquery-tablesorter/jquery.tablesorter.js"></script>
	<script type="text/javascript">
	$(function() {
		$("#activos").tablesorter({widgets:['zebra'], headers:{3:{sorter:false}}});
		$("#inactivos").tablesorter({widgets:['zebra'], headers:{3:{sorter:false}}});
	});
</script>
{% endblock %}